// /*******************************
//             List
// *******************************/
@import "~/scss/themes/index.scss";
@import "~/scss/helpers/_utils.scss";

$base--nav-bg-hover: #f5f7fa;

.ui-nav {
  @include utils-clearfix();

  &.is-horizontal {
    display: inline-block;
  }
  & > li {
    float: left;
    position: relative;
    & > a {
      display: block;
      line-height: 50px;
      display: -ms-flexbox;
      -webkit-align-items: center;
      -ms-flex-align: center;
      align-items: center;
      padding: 0 $h-spacing-base * 1.5;
      height: 50px;
      font-size: 14px;
      text-decoration: none;
      -webkit-transition: background-color 0.2s linear, color 0.2s linear;
      -o-transition: background-color 0.2s linear, color 0.2s linear;
      transition: background-color 0.2s linear, color 0.2s linear;
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;

      &:hover {
        background-color: $base--nav-bg-hover;
      }
    }
  }
}
